<template>
  <j-modal title="工单列表" :width="800" :visible.sync="modalVisible" :maskClosable="false">
    <div>采购单：{{ orderNo }}</div>
    <a-table bordered :pagination="false" :loading="loading" :columns="columns" :data-source="list" :rowKey="(r, index) => index">
      <span slot="action" slot-scope="text, record">
        <a @click="clickDetail(record.id)">处理/详情</a>
      </span>
    </a-table>
    <template #footer>
      <a-button @click="modalVisible = false"> 关闭 </a-button>
    </template>
  </j-modal>
</template>

<script>
import { getAction } from '@/api/manage'

export default {
  data() {
    return {
      modalVisible: false,
      loading: false,
      orderNo: '',
      url: {
        forceComplete: '/hzkj-purchase/purchase/order/info/forceComplete',
      },
      list: [],
      columns: [
        {
          title: '工单号',
          align: 'center',
        },
        {
          title: '工单标题',
          align: 'center',
        },
        {
          title: '工单状态',
          align: 'center',
        },
        {
          title: '处理进度',
          align: 'center',
        },
        {
          title: '操作',
          align: 'center',
          width: 100,
          scopedSlots: { customRender: 'action' },
        },
      ],
    }
  },
  methods: {
    api_open(id, orderNo) {
      this.orderNo = orderNo
      this.modalVisible = true
      this.loading = false

      getAction(this.url.forceComplete, { id }).then((res) => {
        if (res.success) {
          this.list = res.result
        }
      }).finally(() => {
        this.loading = false
      })
    },
  },
}
</script>
